<#include "/template/_blank.html" /> <@head>
<script>
		$(function(){
			$('#pp').portal({
				border:false,
				fit:true
			});
		});
		function add(){
			for(var i=0; i<3; i++){
				var p = $('<div/>').appendTo('body');
				p.panel({
					title:'Title'+i,
					content:'<div style="padding:5px;">Content'+(i+1)+'</div>',
					height:100,
					closable:true,
					collapsible:true
				});
				$('#pp').portal('add', {
					panel:p,
					columnIndex:i
				});
			}
			$('#pp').portal('resize');
		}
		function remove(){
			$('#pp').portal('remove',$('#pgrid'));
			$('#pp').portal('resize');
		}
	</script>
</@head> <@body>
<div id="pp" style="position: relative">
	<div style="width: 50%;">
		<div id="pgrid" title="DataGrid" closable="true"  href="${root}/demo/msg" 
			style="height: 200px;">
		</div>
	</div>
	<div style="width: 50%;">
		<div title="Searching" iconCls="icon-search" closable="true"
			style="height: 80px; padding: 10px;">
			<input class="easyui-searchbox">
		</div>
		<div title="Graph" closable="true"
			style="height: 200px; text- align: center;">
			
		</div>
	</div>
</div>
</@body>
